<template>
  <div>
    <TitleBack :title-name="value"/>

    <van-field v-model="text" label="用户名" placeholder="请输入用户名" />
    <van-field v-model="password" type="password" label="新密码" placeholder="请输入新密码" />
    <van-field v-model="newpassword" type="password"  label="确认密码" placeholder="请输入新密码"
               :error-message="errormessage" @input="confirmpassword"/>
    <van-field v-model="phonenumber" type="tel" label="手机号" placeholder="请输入手机号"/>
    <VerificationCode @getCode="GetCode" :phonenumber="phonenumber"/>
    <div style="margin: 16px;">
      <van-button round block type="danger" native-type="submit" @click="click">
        提交
      </van-button>
    </div>
  </div>
</template>

<script>
import TitleBack from "@/components/TitleBack";
import {postForgotPassword} from "@/api/login-aip";
import VerificationCode from "@/components/VerificationCode";

export default {
  name: "ForgotPassword",
  data() {
    return {
      value: "忘记密码",
      text:'',
      password:'',
      phonenumber:'',
      newpassword:'',
      code:'',
      errormessage:""
    }
  },
  components: {
    TitleBack,
    VerificationCode,

  },
  created() {
    postForgotPassword().then(res=>{
      console.log(res)
    })
  },
  methods:{
    GetCode(data){
      this.code=data
    },
    click(){
      postForgotPassword(this.text,this.password,this.phonenumber,this.code).then(res=>{
        alert(res)
        this.$router.go(-1)
      })
    },
    confirmpassword(){
      if (this.password===this.newpassword){
        this.errormessage =''
      }else (
          this.errormessage ='密码不相同'
      )
    }
  }
}
</script>

<style scoped>

</style>